.fh5co-team-style-1,
.fh5co-team-style-2,
.fh5co-team-style-3 {
	padding: 5em 0;
	@media screen and (max-width: $screen-sm) {
		padding: 3em 0;
	}
}
.fh5co-team-style-1 {
	.fh5co-person {
		position: relative;
		height: 350px;
		display: block;
		margin-bottom: 30px;
		@include bgImageControls;
		.fh5co-overlay,
		.fh5co-text {
			opacity: 0;
			@include fh5co-transition(.5s);
		}
		.fh5co-overlay {
			position: absolute;
			top: 0;
			bottom: 0;
			right: 0;
			left: 0;
			
			// background: rgba(63, 63, 63, .5);
			background: $brand-primary;
			opacity: 0;
			z-index: 2;
		}
		.fh5co-text {
			position: absolute;
			width: 100%;
			text-align: center;
			z-index: 3;
			bottom: 20px;
			opacity: 0;
			padding: 0 15px;
			h3, p {
				opacity: 0;
				position: relative;
				@include fh5co-transition(.5s);
			}
			h3 {
				color: $brand-white;
				top: -30px;
				margin-bottom: 10px;

			}
			p {
				color: rgba(255,255,255,.6);
				top: 30px;
			}
			
		}
		&:hover {
			.fh5co-overlay {
				opacity: .9;
			}
			.fh5co-text {
				opacity: 1;
			}

			h3, p {
				opacity: 1;
				top: 0;
			}
			
		}

	}
}

.fh5co-team-style-2 {
	background: lighten($brand-black, 98%);
	.fh5co-person {
		background: $brand-white;
		text-align: center;
		padding: 30px;
		float: left;
		width: 100%;
		@include fh5co-transition(.5s);
		@include border-radius(7px);
		figure {
			width: 150px;
			height: 150px;
			margin: 0 auto;
			overflow: hidden;
			margin-bottom: 20px;
			@include border-radius(50%);
		}
		.fh5co-text {
			padding: 10px;
			h3 {
				margin-bottom: 0;
			}
			.fh5co-meta {
				color: lighten($brand-black,70%)!important;
				font-family: $font-tertiary;
				font-size: 12px;
				text-transform: uppercase;
				margin-bottom: 20px;
				display: block;
			}
		}
		&:hover, &:focus {
			-webkit-box-shadow: 0 0 20px 10px rgba(0,0,0,.1);
			-moz-box-shadow: 0 0 20px 10px rgba(0,0,0,.1);
			-ms-box-shadow: 0 0 20px 10px rgba(0,0,0,.1);
			-o-box-shadow: 0 0 20px 10px rgba(0,0,0,.1);
			box-shadow: 0 0 20px 10px rgba(0,0,0,.1);
		}
	}
	.fh5co-social {
		padding: 0;
		margin: 0;
		li {
			padding: 0;
			margin: 0;
			list-style: none;
			@include inline-block;
			a {
				color: lighten($brand-black, 50%);
				font-size: $font-size-base + 2;
				padding-left: 10px;
				padding-right: 10px;
				&:hover {
					color: $brand-primary;
				}
			}
		}
	}

}
.fh5co-team-style-3 {
	.person {
		text-align: center;
		margin-bottom: 40px;
		float: left;
		width: 100%;
		img {
			display: block;
			margin: 0 auto 30px auto;
			height: 150px;
			@include border-radius(50%);
		}
		.name {
			font-size: 24px;
			margin-bottom: 0;
		}
		.position {
			text-transform: uppercase;
			margin-bottom: 30px;
			letter-spacing: 2px;
			color: lighten($brand-black,70%);
			font-family: $font-tertiary;
			font-size: 12px;
		}

		.social-circle {
			padding: 0;
			margin: 0;
			li {
				padding: 0;
				margin: 0;
				list-style: none;
				@include inline-block;
				a {
					font-size: 18px;
					padding-left: 10px;
					padding-right: 10px;
					color: lighten($brand-black, 50%);
					&:hover {
						color: $brand-primary;
					}
				}
			}
		}
	}
	
}